<template>
  <el-form :model="data" :rules="dataYZ" ref="data" label-width="120px">
    <div v-if="!isCheckAgent">
      <el-form-item label="公司名称">
        <el-col :span="12">
          <el-input v-model="data.title" clearable></el-input>
        </el-col>
      </el-form-item>

      <el-form-item label="公司地址">
        <el-col :span="12">
          <el-input v-model="data.add" clearable></el-input>
        </el-col>
      </el-form-item>

      <el-form-item label="法人姓名">
        <el-col :span="12">
          <el-input v-model="data.name" clearable></el-input>
        </el-col>
      </el-form-item>

      <el-form-item label="身份证号">
        <el-col :span="12">
          <el-input v-model="data.card" clearable></el-input>
        </el-col>
      </el-form-item>

      <el-form-item label="代理级别">
        <el-col :span="12">
          <el-radio-group v-model="data.types" @change="types_change">
            <el-radio label="3">省代</el-radio>
            <el-radio label="2">市代</el-radio>
            <el-radio label="1">区代</el-radio>
            <el-radio label="4">乡镇</el-radio>
          </el-radio-group>
        </el-col>
      </el-form-item>

      <el-form-item label="代理区域">
        <el-col :span="12">
          <el-input :value="
              this.$fnc.deleteNumber(
                row.province + '' + row.city + '' + row.area + row.town
              )
            " disabled clearable></el-input>
        </el-col>
      </el-form-item>

      <el-form-item label="代理区域" prop="province" v-if="data.types">
        <el-col :span="12">
          <city-cascader size="large" :placeholder="plad" :level="
              data.types == 3
                ? 0
                : data.types == 2
                ? 1
                : data.types == 1
                ? 2
                : 3
            " @change="handleChange" />
        </el-col>
      </el-form-item>

      <el-form-item label="审核状态">
        <el-col :span="12">
          <el-radio-group v-model="data.is_check">
            <el-radio label="0">未审核</el-radio>
            <el-radio label="1">已审核</el-radio>
            <el-radio label="2">驳回</el-radio>
          </el-radio-group>
        </el-col>
      </el-form-item>
    </div>

    <el-form-item label="备注" prop="remark">
      <el-col :span="8">
        <el-input placeholder="请输入备注" type="textarea" v-model="data.remark" style="width:400px" clearable>
        </el-input>
      </el-col>
    </el-form-item>
    
    <el-form-item>
      <el-button :loading="$store.state.isLoading" size="medium" type="primary" @click="subDate('data')">确定</el-button>
    </el-form-item>
  </el-form>
</template>

<script>
import cityCascader from "@/components/currency/cityCascader/cityCascader";
export default {
  components: {
    cityCascader
  },
  props: {
    row: {
      type: Object,
      default: {}
    },
    isCheckAgent: {
      type: Boolean,
      default: false
    }
  },

  computed: {
    plad () {
      var arr = [
        this.row.province || "",
        this.row.city || "",
        this.row.area || ""
      ];
      if (this.row.town) {
        arr.push(this.row.town);
      }
      return arr.join("-");
    }
  },
  created () {
    this.data = {};
    this.data = this.row;
    this.cs = this.$fnc.deleteNumber(
      this.row.shop_province +
      this.row.shop_city +
      this.row.shop_area +
      this.row.shop_town
    );
  },
  data () {
    return {
      JWD: "",
      cs: "",
      cateOptions: [],
      shop_cate: [],
      options: this.$addressJson,
      selectedOptions: [], //["福建省", "福州市", "台江区"]
      optionProps: {
        value: "y",
        label: "y",
        children: "z",
        checkStrictly: true
      },
      data: {
        title: "", //店铺名称

        province: "", //省
        city: "", //市
        area: "", //区
        town: "",
        add: "", //地址
        name: "", //经营分类
        card: "", //经度
        cardpositive: "", //纬度
        cardnegative: "",
        license: "",
        remark: ""
      },
      dataYZ: {
        shop_title: [
          { required: true, message: "请输入店铺名称", trigger: "blur" },
          // { min: 2, max: 10, message: "长度在 2 到 10 个字符", trigger: "blur" }
        ]
      },
      fileList: []
    };
  },
  methods: {
    types_change (value) {
      console.log(value);
      this.data.types = null;
      setTimeout(() => {
        this.data.types = value;
      }, 100);
    },
    handleChange (value) {
      this.data.province = "";
      this.data.city = "";
      this.data.area = "";
      this.data.town = "";
      if (value) {
        for (var i = 0; i < value.length; i++) {
          if (i == 0) this.data.province = value[i];
          if (i == 1) this.data.city = value[i];
          if (i == 2) this.data.area = value[i];
          if (i == 3) this.data.town = value[i];
        }
      }
    },

    subDate (formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          if (this.data.province == "") {
            this.$fnc.alertError("请选择区域地址");
            return false;
          }

          var params = {};
          params = this.data;
          if (this.isCheckAgent) {
            var obj = {};
            obj.id = params.id;
            obj.remark = params.remark;
            this.$api.getAgent.saveEditRemark(obj).then(res => {
              if (res.data.code == 200) {
                this.$emit("openThis");
                this.$fnc.alertSuccess({ text: res.data.code_desc });
              } else {
                this.$fnc.alertError(res.data.code_desc, res.data.result);
              }
            });
          } else {
            this.$api.getAgent.checkAgent(params).then(res => {
              if (res.data.code == 200) {
                this.$emit("openThis");
                this.$fnc.alertSuccess({ text: res.data.code_desc });
              } else {
                this.$fnc.alertError(res.data.code_desc, res.data.result);
              }
            });
          }
        }
      });
    }
  }
};
</script>
